.fb-comments, 
.fb-like-box,
.fb-comments span, 
.fb-like-box span,
.fb-comments span iframe[style], 
.fb-like-box span iframe[style]{
    width: 100% !important;
}
* {
   outline: 0 !important;
}
.captcha_img{
    height:34px;
}

#ajax-loading{
    display: none; 
    border: 1px solid #ccc;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    position: fixed;
    top: 15px;
    right: 15px;
    z-index: 99999;
    background-color: #fff;
    #close-loading{
        cursor: pointer;  
    }
    #content-loading{
        padding: 15px 20px;
    }
}

.jGrowl-closer{
    width: 300px !important;
    border: 2px solid @gray-darker;
    background-color: @gray-dark !important; 
}
.jGrowl-notification{
    border-radius: 0px !important;
    width: 300px !important;
    font-weight: bold !important;
    &.success{
        border: 2px solid darken(@brand-success, 15%);
        background-color: darken(@brand-success, 0%) !important;
    }
    &.info{
        border: 2px solid darken(@brand-info, 15%); 
        background-color: darken(@brand-info, 0%) !important; 
    }
    &.warning{
        border: 2px solid darken(@brand-warning, 15%);
        background-color: darken(@brand-warning, 0%) !important;     
    }
    &.error{
        border: 2px solid darken(@brand-danger, 15%);
        background-color: darken(@brand-danger, 0%) !important;    
    }  
}
/* tooltip, popover
-------------------------------------------------- */
[rel=tooltip],
[rel=popover]{
    display: inline-block;
}


/* text
-------------------------------------------------- */
.decoration-none,
.decoration-none:hover,
.decoration-none:focus,{
    text-decoration: none; 
}
 
/* Margin, padding
-------------------------------------------------- */
.margintop0 {
    margin-top: 0px
}
.margintop5 {
    margin-top: 5px
}
.margintop10 {
    margin-top: 10px
}
.margintop15 {
    margin-top: 15px
}  
.margintop20 {
    margin-top: 20px
} 
.margintop30 {
    margin-top: 30px
} 
.marginbottom0 {
    margin-bottom: 0px
}
.marginbottom5 {
    margin-bottom: 5px
}
.marginbottom10 {
    margin-bottom: 10px
}
.marginbottom15 {
    margin-bottom: 15px
}  
.marginbottom20 {
    margin-bottom: 20px
} 
.marginbottom30 {
    margin-bottom: 30px
}



.marginleft0{
    margin-left: 0px;    
}
.marginleft5{
    margin-left: 5px;    
}
.marginleft10{
    margin-left: 10px;    
}

.marginright0{
    margin-right: 0px;    
}
.marginright5{
    margin-right: 5px;    
}
.marginright10{
    margin-right: 10px;    
}


.pointer{
    cursor: pointer;
} 


/* Key scaffolding
-------------------------------------------------- */

body {
    position: relative; /* For scrollyspy */
    padding-top: 40px; /*  for fixed navbar */
}

#container-main{
/*    border-left: 1px solid @gray-lighter;
    border-right: 1px solid @gray-lighter;
    border-bottom: 1px solid @gray-lighter;      */
    padding-top: 15px;
}

#footer{
    border-top: 1px solid @gray-lighter; 
}

/* Form
-------------------------------------------------- */
span.required,
div.errorMessage{
    color: @brand-danger;
}


.dropdown-menu{
    &.medium{
        li{
            a{
                padding: 5px 15px;
            }
        }  
    }
}

/********  Font Awesome ********/
.fa-fw{
    &.small{
        width: 1.8em;
    }
    &.medium{
        width: 2em;
    }
}

/* -------------- PANEL ----------------*/
.panel{
    &.panel-simple{
        box-shadow: none;
        .panel-heading{
            padding: 5px 0px;
            border-bottom: 1px solid @gray-lighter;
            .panel-under{
                display: block;
                height: 5px;
                margin: 5px 0 -5px;
                width: 100px;
            }
            &.primary{
                border-bottom: 1px solid lighten(@brand-primary, 20%);   
                .panel-under{
                    background: none repeat scroll 0 0 @brand-primary;
                }
            }
            &.success{
                border-bottom: 1px solid lighten(@brand-success, 20%);  
                .panel-under{
                    background: none repeat scroll 0 0 @brand-success;
                }
            }
            &.warning{
                border-bottom: 1px solid lighten(@brand-warning, 20%);  
                .panel-under{
                    background: none repeat scroll 0 0 @brand-warning;
                }
            }
            &.danger{
                border-bottom: 1px solid lighten(@brand-danger, 20%);  
                .panel-under{
                    background: none repeat scroll 0 0 @brand-danger;
                }
            }
            &.info{
                border-bottom: 1px solid lighten(@brand-info, 20%);  
                .panel-under{
                    background: none repeat scroll 0 0 @brand-info;
                }
            } 
            
            .panel-title{
                font-size: @font-size-h3;
            }
            

        }
        .panel-body{
            padding: 15px 0px;
        }
        
    }
}
.list-group{
    &.small{
        a{
            padding: 6px 10px;
        }    
    }
    &.medium{
        a{
            padding: 8px 12px;
        }    
    }
}
    
.page-header{
    margin-top: 0px; 
    h3{
        margin: 0px;
    }
    .page-header-under{
        background: none repeat scroll 0 0 @brand-primary;
        display: block;
        height: 5px;
        margin: 15px 0 -10px;
        width: 100px;
        &.primary{
            background: none repeat scroll 0 0 @brand-primary;  
        }
        &.success{
            background: none repeat scroll 0 0 @brand-success;  
        }
        &.warning{
            background: none repeat scroll 0 0 @brand-warning;  
        }
        &.danger{
            background: none repeat scroll 0 0 @brand-danger;  
        }
        &.info{
            background: none repeat scroll 0 0 @brand-info;  
        } 
    }
}

.nav{
    &.nav-tabs{
        a{
            cursor: pointer;
        }
    }
}

.dropdown-menu.cats{
    min-width: 200px;
    a{
        white-space: normal;
    }
}

/* modal */
@media screen and (min-width: @screen-sm-min) {
  .modal-dialog {
    width: 660px;
  }
}
.modal-footer{
    margin: 0px;
}
 
.navbar.navbar-fixed-top{
    &.simple{
        min-height: 40px;
        .navbar-brand{
            padding: 10px 15px;
        }
        .navbar-nav{
            margin: 0 -15px;
            li > a{
                padding: 10px 15px;
            }
  
        }
        .navbar-toggle{
            margin: 6px 15px;
            padding: 6px 7px;
        }
        .dropdown.user > a{
            //margin-right: -15px;
        }
    }
}
.jumbotron{
    &.simple{
        padding: 10px 0px;
        font-size: 18px;
        margin-bottom: 0px;
        h1{
            font-size: 28px;
            margin:10px 0px;
            text-shadow: 2px 1px 0 #eee, 3px 2px 0 rgba(0, 0, 0, 0.1);
            small{
                text-shadow: none;   
            }
        } 
    }
    &.small{
        padding: 5px 10px;
        font-size: 16px;    
    }   
    &.mini{
        padding: 5px 10px;
        font-size: 12px;    
    }       
}

.panel-darker{
    .panel-heading{
        font-weight: bold;
    }
    &.panel-danger{
        .panel-variant(@brand-danger; #fff; @brand-danger; @brand-danger);
        .list-group{
            a{
                border-color: lighten(@brand-danger, 30%);
                background-color: lighten(@brand-danger, 40%);
                
                .fa-border{
                    border: 1px dotted lighten(@brand-danger, 30%);  
                }
                &:hover{
                    background-color: lighten(@brand-danger, 8%);
                    color: #fff;
                    .badge{
                        background-color: @brand-danger;
                        color: #fff;
                    }
                    
                    .fa-border{
                        -webkit-transform: rotate(+10deg);
                        -moz-transform: rotate(+10deg);
                        -o-transform: rotate(+10deg);
                    }  
                }
            }
        }
    }
}
a.list-group-item{  
    &.active,
    &.active:hover,
    &.active:focus {
        &.danger{
            background-color: lighten(@brand-danger, 8%);
            border-color: @brand-danger;
        }
        &.primary{
            background-color: lighten(@brand-primary, 10%);
            border-color: @brand-primary;
        }
    } 
}

    
.well{
    &.simple{
        box-shadow: none;
        padding: 10px;
        border: none;
    }
}   
    
.border-dotted{
    border-style: dotted;
}  
.border-dashed{
    border-style: dashed;
} 
.border-primary{
    border-color: lighten(@brand-primary, 20%);
} 
.border-info{
    border-color: lighten(@brand-info, 20%);
}
.border-danger{
    border-color: lighten(@brand-danger, 20%);
}
.border-warning{
    border-color: lighten(@brand-warning, 20%);
}